*{
    margin: 0;
    padding: 0;
}
li{
    list-style: none;
}
#header{
    width: 10rem;
    height: 50px;
    background-color: #1D6DFF;
    color: white;
    overflow: hidden;
    position: relative;
    .xz{
        font: .48rem/1.3333rem "";
        position: absolute;
        right:.5333rem;
        top: 0;
    }
    .fh{
        font: .48rem/1.3333rem "";
        position: absolute;
        left: .5333rem;
    }
    .bt{
        font: .5333rem/1.3333rem "";
        font-weight: bold;
        width: 4.5333rem;
        text-align: center;
        margin: 0 auto;
    }
}
#nav{
    .top{
        border-top: #F3F3F3 .1333rem solid;
        .top_ul{
            display: flex;
            li{
                font: .3733rem/.4267rem "";
                margin: .2667rem 0;
                flex: 1;
                text-align: center;
            }
        }
    }
    .mid{
        height: .8rem;
        background-color: #F3F3F3;
        position: relative;
        border-top: #ccc solid .0533rem;
       .k{
           font: .8rem/.8rem "";
           color: #ccc;
           position: absolute;
           right: 0;
       } 
    }
    .data1{
        ul{
            li{
                font: .3733rem/.4267rem "";
                font-weight: bold;
                padding: .2667rem 0;
                padding-left: .2667rem;
                border-bottom: .0267rem solid #ccc;
            }
        }
    }
    .data2{
        ul{
            li{
                font: .3733rem/.4267rem "";
                font-weight: bold;
                padding: .2667rem 0;
                padding-left: .2667rem;
                border-bottom: .0267rem solid #ccc;
            }
        }
    }
    .hide{
        display: none;
    }
    .show{
        display: block;
    }
}
#main{
    width: 10rem;
    .lis li{
        overflow: hidden;
        .boxpb{
            height: 8rem;
            width: 5rem;
            box-sizing: border-box;
            border: 1px solid #ccc;
            padding: 0 .2667rem;
            position: relative;
            float: left;
            img{
                height: 3.7333rem;
                width: 3.7333rem;
                display: block;
                margin: .8rem auto 0;
            }
            .jieshao{
                font: .4267rem/.48rem "";
                margin: .1333rem 0;
            }
            .jiage{
                font: .4267rem/.48rem "";
                color: #1D84FF;
                margin: .1333rem 0;
            }
        }
    }
}
#foot{
    ul{
        width: 10rem;
        display: flex;
        margin: 15px 0;
        li{
            border-top: 1px solid #666;
            border-bottom: 1px solid #666;
            flex: 1;
            height: .9067rem;
            text-align: center;
            color: #666;
            font: .3733rem/.9067rem "";
        }
        .li1{
            border-right: 1px solid #666;
        }
        .li3{
            border-left: 1px solid #666;
        }
    }
    .p1{
        height: 1.0133rem;
        width: 10rem;
        text-align: center;
        font: .3733rem/.5067rem "";
        color: #666;
    }
}
.title{
    position: relative;
}
#x{
    position: absolute;
    right: .5333rem;
}